import { onMounted, onUnmounted, reactive } from "vue";

export function useMousePosition() {
  //   const x = ref(0);
  //   const y = ref(0);
  const position = reactive({
    x: 0,
    y: 0
  });

  function update(e) {
    // x.value = e.pageX;
    // y.value = e.pageY;
    position.x = e.pageX;
    position.y = e.pageY;
  }

  onMounted(() => {
    window.addEventListener("mousemove", update);
  });

  onUnmounted(() => {
    window.removeEventListener("mousemove", update);
  });

  //   return { x, y };
  return { position };
}
